<template>
  <div class="main-container-app">
    <el-row class="form-contain">
      <track-car-form @handleQueryTrace="handleQueryTrace"></track-car-form>
    </el-row>
    <div class="table-contain">
      <track-car-table :searchList="trackListRes" :listLoadingDataRe="loading"
                       @handleCurrentChangeTrace="handleCurrentChangeTrace"
                       @handleSizeQueryTrace="handleSizeQueryTrace"
                       @openUpload="openUpload"></track-car-table>
    </div>
    <track-upload-excel :uploadVisible.sync="uploadVisible"></track-upload-excel>
  </div>

</template>

<script>
  import {queryTraceCar} from '../../api/comprehensive/track';
  import TrackCarForm from './compreChild/trackForm';
  import TrackCarTable from './compreChild/trackTable';
  import TrackUploadExcel from "./compreChild/trackUploadExcel";

  export default {
    components: {
      TrackUploadExcel,
      TrackCarTable,
      TrackCarForm
    },
    data() {
      return {
        trackListRes: null,
        uploadVisible: false,
        loading: false,
        listQuery: {
          num: 1,
          pageSize: 20,
          condition: {
            end: null,
            parkNo: null,
            plateColor: null,
            plateNo: null,
            start: null,
            traceType: null,
          }
        }

      };
    },
    mounted() {

    },
    created() {
      this.queryTraceCar();
    },
    methods: {

      handleQueryTrace(val) {
        this.listQuery.condition = val;
        this.listQuery.num = 1;
        this.listQuery.pageSize = 20;
        this.queryTraceCar();
      },
      handleSizeQueryTrace(val) {
        this.listQuery.pageSize = val;
        this.listQuery.num = 1;
        this.queryTraceCar();
      },
      handleCurrentChangeTrace(val) {
        this.listQuery.num = val;
        this.queryTraceCar();
      },

      queryTraceCar() {
        this.loading = true;
        queryTraceCar(this.listQuery).then(res => {
          this.trackListRes = res;
          this.loading = false;
        }, () => {
          this.loading = false;
        });
      },
      openUpload(val) {
        this.uploadVisible = val;
      }
    }
  };
</script>

<style scoped>

</style>
